<#include "../template/template_editPage.ftl">
<@edit title="照片管理">
<head>
	 <link href="${web_static}/admin/css/input.css" rel="stylesheet" type="text/css" />
	 <link href="${web_static}/common/css/base.css" rel="stylesheet" type="text/css" />
      <link href="${web_static}/common/css/jquery.zoomimage.css" rel="stylesheet" type="text/css" />
      <link href="${web_static}/common/css/web.css" rel="stylesheet" type="text/css" />
	 <link rel="stylesheet" type="text/css" href="${web_static}/webupload/webuploader.css" />
     <link rel="stylesheet" type="text/css" href="${web_static}/webupload/style.css" />
	 <script type="text/javascript" src="${web_static}/webupload/jquery-1.10.2.min.js"></script>
     <script type="text/javascript" src="${web_static}/webupload/webuploader.js"></script>
     <script type="text/javascript" src="${web_static}/webupload/upload.js"></script>
	 <script type="text/javascript" src="${web_static}/common/js/jquery.form.js"></script>
     <script type="text/javascript" src="${web_static}/common/js/jquery.metadata.js"></script>
     <script type="text/javascript" src="${web_static}/common/js/jquery.validate.js"></script>
     <script type="text/javascript" src="${web_static}/common/js/jquery.validate.methods.js"></script>
     <script type="text/javascript" src="${web_static}/common/js/jquery.validate.cn.js"></script>
</head>

<body class="input">
<script type="text/javascript">
    var hasUpload=false;
	$().ready( function() {
	
		var $validateErrorContainer = $("#validateErrorContainer");
		var $validateErrorLabelContainer = $("#validateErrorContainer ul");
		var $validateForm = $("#inputForm");
		
		// 表单验证
		$validateForm.validate({
			errorContainer: $validateErrorContainer,
			errorLabelContainer: $validateErrorLabelContainer,
			wrapper: "li",
			errorClass: "validateError",
			ignoreTitle: true,
			rules: {
				"starPhotoInfo.albumId": {
						required: true
				},
				"starPhotoInfo.introduction":{
						maxlength:200
				}
			},
			messages: {
				"starPhotoInfo.albumId": {
						required: "请选择所属相册"
				},
				"starPhotoInfo.introduction":{
						maxlength:"照片简介必须要在200个字符内"
				}
			},
			submitHandler: function(form) {
				if(hasUpload){
				   $(form).find(":submit").attr("disabled", true);
				   form.submit();
				}else{
				 var html='<label for="starPhotoInfo.albumId" generated="true" class="validateError" style="display: inline;">请至少上传一个图片</label>';
				  $validateErrorLabelContainer.append(html).show();
				  $validateErrorContainer.show();
				}
				
			}
		});
		<#if actionErrors??&&(actionErrors?size > 0)>
			$.dialog({type: "warn", content: "<#list errorMessages as list>${list}<br></#list>",
			 modal: true, autoCloseTime: 3000});
		</#if>
	});
	
	
	</script>
	<div class="body">
		<div class="inputBar">
			<h1><span class="icon">&nbsp;</span>上传大明星图片</h1>
		</div>
		<div style="display: none;" id="validateErrorContainer" class="validateErrorContainer">
			<div class="validateErrorTitle">以下信息填写有误,请重新填写</div>
				<ul></ul>
			</div>
		</div>		
		<form id="inputForm" class="validate" action="${web_base}/go/star_photo!save.htm" method="post">
			<table class="inputTable tabContent">

				<tr>
					<th>
						所属相册：
					</th>
					<td>
					   <select name="starPhotoInfo.albumId" class="{required: true}" style="font-size: 14px">
						    <option value="" >请选择</option>
							<#if albumList??>
                        	<#list albumList as obj>
	                            <option value="${(obj.id)!}">
		                           <#if obj.name?? && obj.name?length gte 15>
			                                <#--//截取输出文字的长度-->
			                                ${obj.name?substring(0,15)}...
			                        <#else>
		                                ${(obj.name)!}
		                            </#if>
                               </option>
		                        </#list>
		                    </#if>
						</select>
					</td>
				</tr>
				<tr>
					<th>
						设为票选：
					</th>
					<td>
						<input type="checkbox" name="starPhotoInfo.isElect" class="" value="1" />
					</td>
				</tr>
				<tr>
					<th>
						票选日期：
					</th>
					<td>
						<input type="text" id="startTime" name="starPhotoInfo.electBeginTime"
                          onclick="WdatePicker({skin:'whyGreen',startDate:'%y',dateFmt:'yyyy-MM-dd'})"
                           value="${(starPhotoInfo.electBeginTime)!}" class="Wdate fixWidth" >
				     <span>--</span> <input type="text" id="endTime" name="starPhotoInfo.electEndTime"
                          onclick="WdatePicker({skin:'whyGreen',startDate:'%y',dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startTime\')}'})"
                          value="${(starPhotoInfo.electEndTime)!}" class="Wdate fixWidth">
					</td>
				</tr>
				<tr>
					<th>
						上传图片：
					</th>
					<td>
					 <div id="wrapper">
	       			 <div id="container">
	          		  <!--头部，相册选择和格式选择-->

		            	<div id="uploader">
		                <div class="queueList">
		                    <div id="dndArea" class="placeholder">
		                        <div id="filePicker"></div>
		                        <p>单次最多可选50张</p>
		                    </div>
		                </div>
		                <div class="statusBar" style="display:none;">
		                    <div class="progress">
		                        <span class="text">0%</span>
		                        <span class="percentage"></span>
		                    </div><div class="info"></div>-
		                    <div class="btns">
		                        <div id="filePicker2"></div><div class="uploadBtn">开始上传</div>
				                    </div>
				                </div>
				            </div>
				        </div>
				   		</div>
					</td>
				</tr>
			</table>
			<div id="pathDiv"></div>
			<div class="buttonArea">
				<input type="submit" class="formButton" value="提  交" hidefocus="true" />&nbsp;&nbsp;&nbsp;&nbsp;
				<input type="button" class="formButton" onclick="window.history.back(); return false;" value="返  回" hidefocus="true" />
			</div>
		</form>
	</div>
</body>
</@edit>